<!DOCTYPE html>
<html lang="en" xmlns:v="http://www.w3.org/1999/xhtml" xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title></title>
    <link type="text/css" rel="stylesheet" href="../hui/css/hui.css" />
    <script src="../js/hui_common.js"></script>
    <script src="https://cdn.bootcss.com/vue/2.2.2/vue.min.js"></script>
    <script src="https://cdn.bootcss.com/vue-resource/1.3.4/vue-resource.common.js"></script>
</head>
<body id="body">
    <div class="hui-wrap">
       <!-- <div class="line"></div>
        <div class="hui-title">
            通用标题
        </div>
        <div class="line"></div>
        <div class="hui-title hui-primary-txt">
            通用标题 + More
            <div class="hui-more"><a href="javascript:hui.toast('more...')">More...</a></div>
        </div>
        <div class="line"></div>-->
        <div class="hui-center-title">
            <h1>居中的标题</h1>
        </div>
        <!--<div class="line"></div>
        <div class="hui-common-title" style="margin-top:15px;">
            <div class="hui-common-title-line"></div>
            <div class="hui-common-title-txt">带有修饰的标题</div>
            <div class="hui-common-title-line"></div>
        </div>-->
        <div class="hui-content" style="padding:10px;">
            <h2>文本段落演示</h2>
            是啊，春风十里不及你。后来，你们单位的事太多，我陪着你回到了你的宿舍。
            <p>使用P标记会缩进！你的宿舍简单到只有一张床一套沙发和一个衣柜。我说，你这是一箪食一瓢饮的颜回，你点头，我就喜欢这样安静的生活，人不堪其忧，我也不改其乐。</p>
        </div>
    </div>

    <div class="hui-wrap">
        <div id="refreshContainer" class="hui-refresh">
            <div class="hui-refresh-icon"></div>
            <div class="hui-refresh-content hui-media-list" style="padding:10px;" id="info">
                <ul>
                    <li v-for="i in info">
                        <a>
                            <input type="hidden" value="{{i.headimgurl}}">
                            <div class="hui-media-list-img hui-fr">
                                <img v-bind:lazySrc = i.headimgurl src="../imgs/lazy.png"  class="hui-lazy"/>
                            </div>
                            <div class="hui-media-content hui-media-content-left">
                                <h1>{{i.nickname}}</h1>
                                <p>{{i.openid}}</p>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</body>
<script src="../hui/js/hui.js"></script>
<script src="../hui/js/hui-refresh-load-more.js"></script>
<script type="text/javascript">
    //循环加载数据定义data下面的info，其他参数随意
    var data = new Vue({
        el: "#info",
        //定义页面所需v-model等参数
        data: {
            info: []
        }
    });
    hui.refresh('#refreshContainer', refresh);
    hui.loadMore(more);

    function refresh() {
        c_getJSON(COMMON.url + 'wx_test/i', '', data);
    }

    function more() {
        c_getMore(COMMON.url + 'wx_test/i', '', data);
    }
</script>
</html>